<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<script type="text/javascript" src="__PUBLIC__/js/jQuery/jquery.js"></script>
		<script type="text/javascript" src="__PUBLIC__/js/jQuery/plugin/thumb.js"></script>
        <link href="../Public/style/common.css" rel="stylesheet" />
        <style type="text/css">
        	body			{text-align:left; background:#fff;}
        </style>
        
        <?php
			if ( isset( $_REQUEST['custom'] ) && $_REQUEST['custom'] == 'video' ){
				$custom_width = 460;
				$custom_height = 320;
			}else{
				$custom_width = C('PIC_THUMB_WIDTH');
				$custom_height = C('PIC_THUMB_HEIGHT');
			}
		?>
        
        <script type="text/javascript">
			function preview(img, selection) { 
				var scaleX = {$custom_width} / selection.width; 
				var scaleY = {$custom_height} / selection.height; 
				
				$('#thumbnail + div > img').css({ 
					width: Math.round(scaleX * {$current_large_image_width}) + 'px', 
					height: Math.round(scaleY * {$current_large_image_height}) + 'px',
					marginLeft: '-' + Math.round(scaleX * selection.x1) + 'px', 
					marginTop: '-' + Math.round(scaleY * selection.y1) + 'px' 
				});
				$('#x1').val(selection.x1);
				$('#y1').val(selection.y1);
				$('#x2').val(selection.x2);
				$('#y2').val(selection.y2);
				$('#w').val(selection.width);
				$('#h').val(selection.height);
			} 
			
			$(document).ready(function () { 
				$('#save_thumb').click(function() {
					var x1 = $('#x1').val();
					var y1 = $('#y1').val();
					var x2 = $('#x2').val();
					var y2 = $('#y2').val();
					var w = $('#w').val();
					var h = $('#h').val();
					if(x1=="" || y1=="" || x2=="" || y2=="" || w=="" || h==""){
						alert("请裁切图像");
						return false;
					}else{
						return true;
					}
				});
			}); 
			
			$(window).load(function () { 
				$('#thumbnail').imgAreaSelect({ aspectRatio: '1:<?php echo $custom_height/$custom_width; ?>', onSelectChange: preview }); 
			});
		</script>
	</head>
	<body>
		<h2 style="padding:25px 0px 0px 25px;">裁切图像</h2>
		<div align="left" style="padding:0px 0px 0px 25px;">
			<img src="{$_SESSION['user_file_large_path']}" style="float: left; margin-right: 10px;" id="thumbnail" />
			<div style="border:1px #e5e5e5 solid; float:left; position:relative; overflow:hidden; width:{$custom_width}px; height:{$custom_height}px;">
				<img src="{$_SESSION['user_file_large_path']}" style="position: relative;" />
			</div>
			<br style="clear:both;"/>
			<form name="thumbnail" action="__URL__/thumbcut" method="post">
				<input type="hidden" name="x1" value="" id="x1" />
				<input type="hidden" name="y1" value="" id="y1" />
				<input type="hidden" name="x2" value="" id="x2" />
				<input type="hidden" name="y2" value="" id="y2" />
				<input type="hidden" name="w" value="" id="w" />
				<input type="hidden" name="h" value="" id="h" />
                <br />
                <?php
		        	if ( isset( $_REQUEST['custom'] ) && $_REQUEST['custom'] == 'video' ){
		        		echo '<input type="hidden" name="custom" value="video" />';
		        	}
		        ?>
				<input type="submit" name="upload_thumbnail" value="保存裁切图像" class="SiteAllButton" id="save_thumb" />&nbsp;&nbsp;&nbsp;
				<input type="submit" name="upload_cancel" value="重新上传图片" class="SiteAllButton" id="cancel_thumb" />
				
			</form>
		</div>
		<br />
		<br />
		<br />
	</body>
</html>